<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>封装函数发送 AJAX 请求</title>
</head>
<body>
    <script>
        /**
         * 函数名:  sendAJAX
         * 作用:  发送 AJAX 请求
         * 参数:  type 请求类型,  url 发送的 URL
         * 示例:  sendAJAX('get', 'https://api.xiaohigh.com/duanzi')
         * 返回值: promise 对象
         *      成功的结果  『响应体』
         *      失败的结果  『响应状态码』
         * 
         */
        
        function sendAJAX(method, url){
            //返回 promise 对象
            return new Promise((resolve, reject) => {
                //
                let x = new XMLHttpRequest();
                //设置响应体结果
                x.responseType = 'json';
                //
                x.open(method, url);
                //
                x.send();
                //绑定事件
                x.onreadystatechange = function(){
                    if(x.readyState === 4){
                        if(x.status >= 200 && x.status < 300){
                            //成功
                            resolve(x.response);
                        }else{
                            //失败
                            reject(x.status);
                        }
                    }
                }
            });
        }

        
        //示例
        // 向 http://api.xiaohigh.com/goods 发送 get 请求 , 并控制台输出结果
        // sendAJAX('get', 'http://api.xiaohigh.com/goods').then(response => {
        //     console.log(response);
        // }, status => {
        //     console.log('请求失败, 状态码为: ' + status);
        // });
       

        //发送 POST 请求
        sendAJAX('post', 'http://api.xiaohigh.com/duanzi').then(v => {
            console.log('ok')
        }, r=>{
            console.log('NG');
        })

    </script>
</body>
</html>